<template>
	<view class="orderList">
		<view class="item" v-for="(item, i) in afterSaleList" :key="i">
			<view class="cont">
				<view class="cont-l">
					<image :src="item.commodityPicture" mode="" class="img"></image>
				</view>
				<view class="cont-c">
					<view class="name">{{item.commodityName}}</view>
					<view class="spec">{{item.optionName}}</view>
					<view class="price">
						<text class="price-l">¥{{item.marketingPrice}}</text>
						<text class="price-r">X{{item.buyAmount}}</text>
					</view>
				</view>
			</view>
			<view class="total">
				<text class="total-l"></text>
				<text class="total-c">合计：</text>
				<text class="total-r">{{item.marketingPrice}}</text>
			</view>
			<view class="total">
				<text class="total-l">售后问题：<text v-if="item.saleType == 1">仅退款</text><text v-if="item.saleType == 2">退货退款</text></text>
				<text class="total-r" v-if="item.acceptType == 1">受理中</text>
				<text class="total-r" v-if="item.acceptType == 2">受理成功</text>
			</view>
			<view class="bottom" v-if="item.acceptType == 1">
				<button class="btn1">在线客服</button>
			</view>
		</view>
		<uni-load-more :loadingType="loadingType" :contentText="contentText"></uni-load-more>
	</view>
</template>

<script>
	import Request from '../../../common/request.js'
	import uniLoadMore from '../../../components/uni-load-more.vue'
	export default {
		components:{
			uniLoadMore
		},
		data() {
			return {
				afterSaleList:[],
				pageNum:1,
				pageSize: 10,
				loadingType: 0, //上拉加载类型 0可以加载 1加载中 2没有更多了
				contentText: {
					contentdown: "上拉显示更多",
					contentrefresh: "正在加载...",
					contentnomore: "没有更多数据了"
				}
			};
		},
		onLoad(option) {
			 this.getData();
		},
		methods:{
			getData(){
				Request.fetchPost('/fsbus/M2225',{
					pageNum: this.pageNum,
					pageSize: this.pageSize
				}).then(res=>{
					if(res.errorNo == 0){
						this.afterSaleList = res.results.afterSaleList.list;
						if(this.pageNum ==  res.results.afterSaleList.pages){
							this.loadingType = 2;
						}else {
							this.loadingType = 0;
						}
					}
				}).catch(err=>{})
			},
		},
		/* 下拉刷新 */
		onPullDownRefresh() {
			this.pageNum = 1;
			this.getOrderList('refresh');	
		},
		onReachBottom() {
			if(this.loadingType !=2){
				this.loadingType = 1;
				this.pageNum ++;
				this.getOrderList('add');
			}
		},
	}
</script>

<style>
.orderList {
	width: 100%;
	min-height: 100%;
	position: absolute;
	background-color: #f3f3f3;
	font-size: 26upx;
}

.item {
	width:100%;
	min-height: 200upx;
	background-color: #fff;
	margin-top: 20upx;
	padding: 20upx 30upx;
}

.item .cont {
	display: flex;
}
.item .cont2 {
	width: 100%;
}
.item .cont2 image {
	width: 150upx;
	height: 150upx;
	background-color: #A2A2A2;
	margin-right: 10upx;
}
.item .cont .cont-l {
	width: 150upx;
	height: 150upx;
	margin-right: 40upx;
}
.item .cont .cont-l .img {
	width: 100%;
	height: 100%;
	background-color: #A2A2A2;
}
.item .cont .cont-c {
	flex: 1;
}
.item .cont .name {
	font-size: 24upx;
	height: 50upx;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.item .cont .spec {
	color: #666666;
	font-size: 22upx;
	margin-bottom: 10upx;
}
.item .cont .price-l {
	float: left;
	color: #2E2E2E;
}
.item .cont .price-r {
	float: right;
	font-size: 22upx;
	color: #999999;
}
.item .total {
	height: 80upx;
	line-height: 80upx;
}
.item .total .total-l {
	width: 400upx;
	height: 80upx;
	display: inline-block;
	float: left;
}
.item .total .total-l text {
	color: #999;
}
.item .total .total-c {
	float: left;
	margin-left: 40upx;
}
.item .total .total-r{
	float: right;
	color: #F52A4C;
}
.item .bottom {
	overflow: hidden;
}
.item .bottom .btn1{
	width: 320upx;
	height: 54upx;
	background-color: #fff;
	color: #F52A4C;
	line-height: 54upx;
	font-size: 24upx;
	float: right;
}
.item .bottom uni-button:after{
	border: 1px solid #F52A4C;
}
</style>
